<%-- 
  -- Body para mostrar opciones de busqueda de Deudas a cobrar.
  --
  --
  -- @author nicolas.gonzalez
--%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<%@ taglib uri="/WEB-INF/struts-html-el-1.2.8.tld" prefix="html-el"%>
<%@ taglib uri="/WEB-INF/struts-logic-el-1.2.8.tld" prefix="logic-el"%>
<%@ taglib uri="/WEB-INF/security.tld" prefix="security" %>
<%@ taglib uri="/WEB-INF/ajaxtags.tld" prefix="ajax" %>

<%@ taglib uri="http://struts.apache.org/tags-bean-el" prefix="bean2"%>

<script src="<html:rewrite page='/protected/script/util.js'/>" type="text/javascript"></script>


<%-- Para EXT --%>
<link rel="stylesheet" type="text/css" href="<html:rewrite page='/protected/script/ext-1.1.1/resources/css/ext-all.css'/>" />

<script src="<html:rewrite page='/protected/script/ext-1.1.1/adapter/ext/ext-base.js'/>" type="text/javascript"></script>
<script src="<html:rewrite page='/protected/script/ext-1.1.1/ext-all.js'/>" type="text/javascript"></script>

<!-- Para AjaxTags -->
<script src="<html:rewrite page='/protected/script/scriptaculous/scriptaculous.js'/>" type="text/javascript"></script>
<script src="<html:rewrite page='/protected/script/ajaxtags/ajax/ajaxtags.js'/>" type="text/javascript"></script>
<script src="<html:rewrite page='/protected/script/ajaxtags/ajax/ajaxtags_parser.js'/>" type="text/javascript"></script>
<script src="<html:rewrite page='/protected/script/ajaxtags/ajax/ajaxtags_controls.js'/>" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="<html:rewrite page='/protected/style/ajaxtags/ajaxtags.css'/>" id="AjaxTagsCssId"/>

<div class="errors">
    <html:errors />
</div>


<script type="text/javascript">
    /* Busca las deudas 
     */
    var findDebts = function() {
        if (!Util.valid.isBlank($("customerId").value)) {
            var oldCorpName = $("hiddenAutoCompleteCustomerCorpNameId").value;
            var actualCorpName = $("corporateNameId").value;
            
            if (oldCorpName != actualCorpName) {
                // Se modifico  => limpio todo y alerto
                $("hiddenAutoCompleteId").value = "";
                $("hiddenAutoCompleteCustomerCorpNameId").value = "";
                $("corporateNameId").value = "";
                Ext.MessageBox.alert('Error', 'Por favor, no modifique el campo de cliente una vez que lo elige de la lista ... ');
                $("corporateNameId").focus();
                return;
            }
         }
        $("customerIdFindId").value = $("customerId").value;   
    
        var courseSelectedObj = $("courseSelectedId");
        var courseSelectedValue = courseSelectedObj.options[courseSelectedObj.selectedIndex].value;
        if (courseSelectedValue != "-1") {
            // -1 = todos
            $("courseSelectedFindId").value = courseSelectedValue;   
        }
        else {
        	$("courseSelectedFindId").value = "";
        }
        
        var form = $("findDebtsToCollectFormId");
        form.submit();
    }
    
    /* 
     * Procesa la respuesta del autocomplete
     * Se deja en hiddenAutoCompleteId (un hidden) el "id;razon social"
     * entonces se parsea y se saca el id y se deja en "customerId" y en 
     * "corporateNameId" se deja la "razon social"
     */
    var postAutoCompleteCorporateName = function() {
        var hiddenAutoCompleteValue = $("hiddenAutoCompleteId").value;
    
        if (!Util.valid.isBlank(hiddenAutoCompleteValue)) {
            // Algo se trajo entonces se parsea
            var splitted = hiddenAutoCompleteValue.split(';'); 
            
            var id = splitted[0];
            var corporateName = splitted[1];
            
            $("customerId").value = id;
            $("corporateNameId").value = corporateName;  
            $("hiddenAutoCompleteCustomerCorpNameId").value = corporateName;
            
            // Limpio lo que estaba antes....
            $("hiddenAutoCompleteId").value = "";
        }
        // TODO Analizar el else!!!
    
    }
    
    // Decora los titles de HTML. Lo hace mas lindo, pero mas pesado...
    Ext.QuickTips.interceptTitles = true;
    Ext.QuickTips.init();
</script>

<%-- El ID del form NO debe ser modificado. Se usa desde el menu --%>
<html:form action="/protected/showFindDebtOptionsToCollect" styleId="collectFormId">
    
    <h2>Obtenci&oacute;n de Deudas para poder cobrar</h2>
    
    <div class="debtOptionsToCollectEdit">
        <table class="tableDataDebt" cellspacing="0">
            <tr>
                <td class="tableDataTitle">
                    Cliente
                </td>
                <td class="tableDataValue">
                    <html:text property="corporateName" styleId="corporateNameId" styleClass="form-autocomplete" size="40" title="Ingrese la razon social del cliente y espere a que se carguen los resultados ..." />
                    <%--    En customerId esta el ID cuando se autocompleta luego del post-function. 
                            En hiddenAutoCompleteId esta lo q vino del autocomplete como auxiliar --%>
                    <html:hidden property="customerId" styleId="customerId"/>
                    <input type="hidden" name="hiddenAutoComplete" id="hiddenAutoCompleteId" />
                    <input type="hidden" name="hiddenAutoCompleteCustomerCorpName" id="hiddenAutoCompleteCustomerCorpNameId" />
                </td>   
            </tr>
            <tr>
                <td class="tableDataTitle">
                    Curso
                </td>
                <td class="tableDataValue">
                    <html:select property="courseSelected" styleClass="allSelects" styleId="courseSelectedId" title="Cursos ..." >
                        <option value="-1">Todos</option>
                        <html:optionsCollection property="courseOptions"/>
                    </html:select>
                </td>            
            </tr>
        </table>

        <div id="clear">
        </div>
        <div id="clear">
        </div>
        
        <%-- No se valida seguridad ya que SOLO entran aca los q tienen permiso --%>
        <div class="panelButton">
              <input type="button" value="Buscar" onclick="findDebts();" title="Busca las deudas aplicando las condiciones ingresadas ..." class="button">
        </div>  
    
    </div>

    <%-- Indicador de llamada de AJAX para el autocomplete --%>
    <span id="indicatorRegion" style="display: none; margin-left: 50%;">
        <img id="pepepepep" style="border: 0px;" title="title" src="<html:rewrite page="/protected/img/ajax-loader.gif"/>" />
    </span>


</html:form>

<ajax:autocomplete
  baseUrl="${pageContext.request.contextPath}/protected/autocompleteCustomers.do"
  source="corporateNameId"
  target="hiddenAutoCompleteId"
  parameters="corporateName={corporateNameId}"
  className="autocomplete"
  indicator="indicatorRegion"
  minimumCharacters="2"
  postFunction="postAutoCompleteCorporateName"
/>

<%-- Inyectados por Javascript --%>
<div id="findDivId" class="hideClass">
    <html:form action="/protected/findDebtsToCollect" styleId="findDebtsToCollectFormId">
        <html:hidden property="customerId" value="" styleId="customerIdFindId" />
        <html:hidden property="courseSelected" value="" styleId="courseSelectedFindId" />
    </html:form>
</div>